import './index.css';
import { FC, Component } from 'react';

// 定义 Content 组件的 Props 接口
interface ContentProps {
  bgColor?: string; // 可选参数，类型为 string
}
  
const Content: FC<ContentProps> = ({ bgColor = '#ffffff' }) => {
  return (
    <div className="contentWrap" style={{background:  bgColor}}>
      <div className="title"></div>
      <div className="content"></div>
    </div>
  )
}

class Home extends Component {  
  componentDidMount() {  
    this.myFunction()
  }  
  private a: number = 1
  myFunction() {
    this.a = this.a+1
    console.log('页面加载完成，自动执行函数===' + this.a)
  }

  render = () => {
    return (
      <div className="wrap">
        <div className="wrapper">
          <div className="speaker">
            <div className="title"></div>
          </div>
          <div className="right">
            <Content bgColor="#5F5F5F" />
            <Content bgColor="#525252"/>
            <Content bgColor="#3D3D3D"/>
          </div>
        </div>
      </div>
    );
  }
}

export default Home;